<template>
	<view>
		<u-gap></u-gap>
		<view class="item" @click="choiceImg('positive')">
			<u-image :src="positiveURL || '/static/cardA.png'" mode="widthFix" width="100%"></u-image>
			<view class="name">正面示例</view>
		</view>
		<u-gap></u-gap>
		<view class="item" @click="choiceImg">
			<u-image :src="backURL ||'/static/cardB.png'" mode="widthFix" width="100%"></u-image>
			<view class="name">反面示例</view>
		</view>
		<u-gap></u-gap>
		<view class="info">
			<u-field v-model="realName" label="姓   名" placeholder="请输入证件姓名">
			</u-field>
			<u-field v-model="number" :border-bottom="false" label="证件号" placeholder="请输入证件照号码">
			</u-field>
		</view>
		<u-gap></u-gap>
		<view class="btn" @click="submit">
			确定
		</view>
		<u-gap></u-gap>
		<view class="safe-area-inset-bottom"></view>
	</view>
</template>

<script>
import {appletImgUrl} from "@/common/config.js"
	export default {
		data() {
			return {
				appletImgUrl:appletImgUrl,
				realName: '',
				backURL: '',
				imageURL: this.imageURL,
				number: '',
				positiveURL: ''
			};
		},
		onLoad(options) {
			this.realState = options.realState
		},
		methods: {
			async submit() {
				if (this.positiveURL == '' || this.number == '' || this.realName == '' || this.backURL == '') {
					uni.showToast({
						title: '请完善上方信息',
						icon: 'none'
					})
					return
				}
				if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(this.number)) {
					uni.showToast({
						title: '请输入正确的身份证格式',
						icon: 'none'
					})
					return
				}
				uni.showLoading({
					title: '正在加载...',
					icon: 'none'
				})
				let positiveURL = await this.uploadImg(this.positiveURL)
				let backURL = await this.uploadImg(this.backURL)
				let url = this.realState == 0 ? 'userverify/apply' : 'userverify/userUpdate'
				await this.$u.post(url, {
					backPhoto: backURL,
					frontPhoto: positiveURL,
					number: this.number,
					realName: this.realName
				})
				let userInfo = await this.$u.get('user/info')
				if (userInfo.headPhoto) {
					if (userInfo.headPhoto.indexOf("https") != 0) {
						userInfo.headPhoto = this.imageURL + userInfo.headPhoto
					}
				} else {
					userInfo.headPhoto = this.appletImgUrl+'logo.png'
				}
				uni.setStorageSync('userInfo', userInfo)
				uni.showToast({
					title: '已提交认证'
				})
				setTimeout(() => {
					this.$u.route({
						type: 'back'
					})
				}, 1500)
			},
			uploadImg(path) {
				return new Promise((resolve, reject) => {
					uni.uploadFile({
						url: this.$u.http.config.baseUrl + '/upload/userPhoto',
						filePath: path,
						name: 'file',
						success: res => {
							let data = JSON.parse(res.data)
							if (data.code == 0) {
								resolve(data.data[0].path + '/' + data.data[0].name)
							} else {
								reject(data.message)
								uni.showToast({
									title: data.message
								})
							}
						},
						fail(error) {
							reject(error)
						}
					})
				})
			},
			choiceImg(scene) {
				console.log(scene)
				console.log(222)
				const self = this
				uni.chooseImage({
					count: 1,
					sourceType:['album','camera'],
					success(res) {
						console.log(res)
						if (scene == 'positive') {
							self.positiveURL = res.tempFilePaths[0]
							self.ocrIdentify(self.positiveURL);
						} else {
							self.backURL = res.tempFilePaths[0]
						}
					}
				})
			},
			ocrIdentify(tempFilePath) {
				console.log('pp',tempFilePath)
				let that=this;
				const invokeRes = wx.serviceMarket.invokeService({
					service: 'wx79ac3de8be320b71',  //固定的不要动
					api: 'OcrAllInOne',             //固定的不要动
					data: {
						// 用 CDN 方法标记要上传并转换成 HTTP URL 的文件
						img_url: new wx.serviceMarket.CDN({
							type: 'filePath',
							filePath: tempFilePath,
						}),
						data_type: 3,        
						ocr_type: 1        // 1是身份证识别  7是营业执照识别
					},
					success: function(res) {   //打印这个res  就是你想要的结果
					console.log(666,res)
						if(res.errMsg=="invokeService:ok"){
							
							that.realName=res.data.idcard_res.name.text;//姓名
							that.number=res.data.idcard_res.id.text;//身份证号
						}
					}
			
				})
			    
			
			}
		}
	}
</script>

<style lang="scss">
	.btn {
		line-height: 100rpx;
		font-size: 30rpx;
		color: #FFFFFF;
		margin: 0 30rpx;
		text-align: center;
		background: linear-gradient(90deg, #FF3868, #FC6161);
		box-shadow: 1px 10px 15px 2px rgba(255, 78, 70, 0.3);
		border-radius: 20rpx;
	}

	.info {
		background-color: #FFFFFF;
		margin: 0 30rpx;
		border-radius: 20rpx;
	}

	.item {
		background-color: #D2D2D2;
		padding: 30rpx;
		border-radius: 20rpx;
		margin: 0 30rpx;

		.name {
			text-align: center;
			margin-top: 20rpx;
			font-size: 36rpx;
			font-weight: bold;
		}
	}

	page {
		background-color: #f7f7f7;
	}
</style>
